﻿@Scripts.Render("https://maps.googleapis.com/maps/api/js?v=3.exp&key=AIzaSyBW-tAI5fYfORgGNNVmtXoQthz3YDxl1C4&sensor=false&libraries=places")
@Scripts.Render("~/Scripts/skel.min.js")
@Scripts.Render("~/Scripts/jquery.dropotron.min.js")
@Scripts.Render("~/Scripts/helios.js")
@Scripts.Render("~/Scripts/mapsPlaces.js")
<script>
    function getRecomandations() {
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "http://localhost:58872/Trip/GetUserTripsRecomandations",
            //data: JSON.stringify(save),
            dataType: "json",
            success: function (data) {
                if (data.Error) {
                    alert(data.Error)
                } else {
                    var reviewDiv = '<article>						<a href="" class="image featured"><img src="{2}" alt="" /></a>						<header>							<h3><a href="#">{0}</a></h3>						</header>						<p>{1}</p>						</article>'
                    for (i = 0; i < data.length; i++) {
                        var review = reviewDiv.replace("{0}", data[i].name);
                        var review = review.replace("{1}", data[i].Description);
                        var review = review.replace("{2}", data[i].Photo);
                        $(".reel").append(review)
                    }
                }
            },
            error: function (result) {
                alert("error");
            }
        });
    }

    $(document).ready(function () {
        getRecomandations();
    });
</script>

	<!-- start main -->
	<div class="main">
		<div class="sidebar">
				<div class="menu_box_list">
				      		<ul id = "list">							
						  		<li value="accommodation"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/accomodation.jpg"><span>Accommodation</span></a></li>						  		
						  		<li value="food"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/food2.jpg"><span>Food & Drink</span></a></li>
			  					<li value="entertainment"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/enter.jpg"><span>Entertainment</span></a></li>
			  					<li value="culture"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/camera2.jpg"><span>Attractions</span></a></li>
			  					<li value="nature"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/nature1.jpg"><span>Nature</span></a></li>
			  					<li value="shopping"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/shopping2.jpg"><span>Shopping</span></a></li>
								<li value="sports"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/sports1.jpg"><span>Sports</span></a></li>
								<li value="transp"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/transp2.jpg"><span>Transportation</span></a></li>
								<li value="helpful"><a href="#"><img style="width:30px; height:30px;" alt="" src="../../Images/help3.jpg"><span>Helpful</span></a></li>
				    		</ul>
				    		<div class="clear"></div>
				      </div>				
		</div>		
		<div class="content" style="width:72%">				
				<div class="content_btm" id="map-canvas" style="margin-top:0px;height:530px">
				
				</div>
		    <input id="pac-input" class="controls" type="text" placeholder="Enter a location">
				<div id="type-selector" class="controls">
				  <input type="radio" name="type" id="changetype-all" checked="checked">
				  <label for="changetype-all">All</label>

				  <input type="radio" name="type" id="changetype-establishment">
				  <label for="changetype-establishment">Places</label>

				  <input type="radio" name="type" id="changetype-geocode">
				  <label for="changetype-geocode">Locations</label>
				</div>		
									
		</div>
		<div class="clear"></div>
	</div>
	<!-- end main -->
	
      <!-- Carousel -->
	<div class="carousel">
				<div class="reel">

					<article>
						<a href="" class="image featured"><img src="{2}" alt="" /></a>
						<header>
							<h3><a href="#">{0}</a></h3>
						</header>
						<p>{1}</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Disco-351602759" class="image featured"><img src="images/pic02.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Fermentum sagittis proin</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/The-Patina-of-Time-and-Tide-352128094" class="image featured"><img src="images/pic03.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Sed quis rhoncus placerat</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Cityparts-XVIII-350427779" class="image featured"><img src="images/pic04.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Ultrices urna sit lobortis</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Vine-Country-381350120" class="image featured"><img src="images/pic05.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Varius magnis sollicitudin</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>

					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Bueller-III-351975087" class="image featured"><img src="images/pic01.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Pulvinar sagittis congue</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Disco-351602759" class="image featured"><img src="images/pic02.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Fermentum sagittis proin</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/The-Patina-of-Time-and-Tide-352128094" class="image featured"><img src="images/pic03.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Sed quis rhoncus placerat</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Cityparts-XVIII-350427779" class="image featured"><img src="images/pic04.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Ultrices urna sit lobortis</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>
				
					<article>
						<a href="http://mdomaradzki.deviantart.com/art/Vine-Country-381350120" class="image featured"><img src="images/pic05.jpg" alt="" /></a>
						<header>
							<h3><a href="#">Varius magnis sollicitudin</a></h3>
						</header>
						<p>Commodo id natoque malesuada sollicitudin elit suscipit magna.</p>							
					</article>

				</div>
			</div>
	